<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>网页布局</title>
    <link href="style.css" rel="stylesheet" type="text/css"/>
</head>
<style>
    body{ margin:0; padding:0; font-size:30px; font-weight:bold}
div{ text-align:center; line-height:50px}
.title{margin: 0 auto; width: 100%; height: 100px; background-color: darkcyan;} 
.content{width: 60%; height:700px; background-color: darkgoldenrod; float: left; text-align: center;}
.side{width: 37%;height:700px; background-color: darkkhaki; float: right; text-align: left; }
.footer{width: 100%; height: 100px; margin: 10px auto; background-color: saddlebrown; clear: both;}
</style>
<body>
<div class="title"><br>header</div>
<div class="main">
    <div class="content">
        <img src="images/java.jpg" style="width:40%;height:32%;">
        <img src="images/php.jpg"style="width:40%;height:32%;">
        <img src="images/oc.jpg"style="width:40%;height:32%;">
        <img src="images/ps.jpg"style="width:40%;height:32%;">
        <img src="images/sql.jpg"style="width:40%;height:32%;">
        <img src="images/android.jpg"style="width:40%;height:32%;">
    </div>
    <div class="side"><?php include "./side.php";?></div>
</div>
<div class="footer">footer</div>
</body>
</html>
